import React, {useEffect, useState} from 'react';
import {
  View,
  Text,
  TouchableOpacity,
  ActivityIndicator,
  FlatList,
  Image,
  ScrollView,
} from 'react-native';
import {useNavigation} from '@react-navigation/native';
import AreaView from '../../components/Layout/AreaView';
import styles from './style';

const QuesDetail = () => {
  const navigation = useNavigation();
  useEffect(() => {
    navigation.setOptions({
      title: '模拟训练',
      // headerRight: () => (
      //   <View style={styles.head_right}>
      //     <Image
      //       style={styles.time_icon}
      //       source={require('../../assets/images/time.png')}
      //     />
      //     <Text style={styles.time_text}>剩余时间：23:21</Text>
      //   </View>
      // ),
    });
  }, [navigation]);

  return (
    <AreaView>
      <View style={styles.ques}>
        <Text style={styles.ques_text}>
          第4题：问下列关于大叶性肺炎的描述，有误的是：
        </Text>
      </View>
      <View style={styles.answer}>
        <TouchableOpacity>
          <View style={[styles.answer_list, styles.selected_answer_list]}>
            <Text style={[styles.left, styles.selected_left]}>A</Text>
            <View style={[styles.line, styles.selected_line]} />
            <Text style={[styles.right, styles.selected_right]}>选项选项选项选项选项选</Text>
          </View>
        </TouchableOpacity>
      </View>
      <View style={styles.answer}>
        <TouchableOpacity  activeOpacity={1} activeOpacity={1}>
          <View style={[styles.answer_list]}>
            <Text style={styles.left}>A</Text>
            <View style={styles.line} />
            <Text style={styles.right}>选项选项选项选项选项选</Text>
          </View>
        </TouchableOpacity>
      </View>
      <View style={styles.btn_container}>
        <TouchableOpacity  activeOpacity={1} style={styles.btn}>
          <Text style={styles.btn_text}>上一题</Text>
        </TouchableOpacity>
        <TouchableOpacity  activeOpacity={1} style={styles.btn}>
          <Text style={styles.btn_text}>下一题</Text>
        </TouchableOpacity>
      </View>
    </AreaView>
  );
};

export default QuesDetail;
